﻿<%@ Page Title="" Language="C#" MasterPageFile="~/Views/Shared/Site.Master" Inherits="System.Web.Mvc.ViewPage<TireBias.Models.BIASPLANModel.BIASPLAN_DS>" %>

<asp:Content ID="Content1" ContentPlaceHolderID="TitleContent" runat="server">
    New_Sample_SUB
</asp:Content>

<asp:Content ID="Content2" ContentPlaceHolderID="MainContent" runat="server">
<div id="numericInput" style="float:left; width:300px;" >   
   <table id="keypad" class="hide">
         <tr style="background-color:#696969;">
         <td colspan="3" style="text-decoration:none; text-align:right; height:75px;">
         <img src="<%: Url.Content("~/Images/power.png")%> "  alt='' width="100px" height="75px" id="close" />
         </td></tr>
         <tr class="rowa" >
            <td class="key ">
               1
            </td>
            <td class="key ">
               2
            </td>
            <td class="key ">
               3
            </td>
         </tr>
         <tr class="rowa" >
            <td class="key ">
               4
            </td>
            <td class="key ">
               5
            </td>
            <td class="key ">
               6
            </td>
         </tr>
         <tr class="rowa" >
            <td class="key ">
               7
            </td>
            <td class="key ">
               8
            </td>
            <td class="key ">
               9
            </td>
         </tr>
         <tr class="rowa" >
            <td class="btn">
               DEL
            </td>
            <td class="key ">
               0
            </td>
            <td class="key ">
               .
            </td>
         </tr>
      </table>
</div>

<table width="98%" class="shadow">
        <tr>
            <td colspan="2" style="background-color: #E46C0A; color: White; font-size: xx-large;
                text-align: center;">
                New Sample&nbsp; <span class="fontTh">(ผ้าใบทดลอง)</span>
            </td>
        </tr>
        <tr class="rowb">
            <td class="head cell text-right" style="width: 35%; padding: 10px 0px;">
                Size &nbsp;<span class="fontTh">ขนาดผ้าใบ</span>
            </td>
            <td class="cell">
                <%: Model._Size %>
            </td>
        </tr>
        <tr class="rowb">
            <td class="head cell text-right" style="padding: 10px 0px;">
                Forming&nbsp;<span class="fontTh">เครื่องที่สร้าง</span>
            </td>
            <td class="cell">
                <%: Model._Forming %>
            </td>
        </tr>
        <tr class="rowb">
            <td class="head cell text-right" style="padding: 10px 0px;">
                Topped Cord &nbsp;<span class="fontTh">ชนิดผ้าใบ</span>
            </td>
            <td class="cell">
                <%: Model._Topcrdcd  %>
            </td>
        </tr>
        <tr class="rowb">
            <td class="head cell text-right" style="padding: 10px 0px;">
                Tire Cord Lot <span class="fontTh">ล็อตผ้าใบ</span>
            </td>
            <td class="cell">
                <%: Model._tcrdlot %>
            </td>
        </tr>
        <tr class="rowb">
            <td class="head cell text-right" style="padding: 10px 0px;">
                Expired date <span class="fontTh">วันหมดอายุ</span>
            </td>
            <td class="cell">
                <%: Model._topexp %>
            </td>
        </tr>
        <tr class="rowb">
            <td class="head cell text-right" style="padding: 10px 0px;">
                Length (M.) &nbsp;<span class="fontTh">ความยาว (ม.)</span>
            </td>
            <td class="cell">
                <%: Model._toplen %>
            </td>
        </tr>
        <tr class="rowa hide" id="ply">
                <td class="head cell text-right" style="padding: 10px 0px;">
                <span></span> M.          
                <span class="fontTh">(เมตร)</span>
                </td>
                <td class="cell" id="Td1">
                <input type="text" value="" />
                </td>
            </tr>
        <tr class="rowa hide" id="ang">
                <td class="head cell text-right" style="padding: 10px 0px;">
                <span></span> Angle          
                <span class="fontTh">องศาผ้าใบ </span><span></span>
                </td>
                <td class="cell" id="Td10">
                <input type="text" value="" />
                </td>
            </tr>

            <tr class="rowa hide" id="width">
                <td class="head cell text-right" style="padding: 10px 0px;">
                  <span></span>  Width (M.)          
                <span class="fontTh">ความกว้าง (ม.) </span><span></span></td>                    
                <td class="cell" id="Td11">
                <input type="text" value="" /></td>
            </tr>
    </table>

</asp:Content>

<asp:Content ID="Content3" ContentPlaceHolderID="FeaturedContent" runat="server">
</asp:Content>

<asp:Content ID="Content4" ContentPlaceHolderID="TableContent" runat="server">
<div style="clear: left; margin-top: 15px; ">

      <div class="float-left" style="margin-left: 50px;">
          <input type="button" id="back" value="BACK" class="btnFooter"  
              style="height: 75px;  width: 350px;" />
        
      </div>
      <div style="float: right; margin-right: 35px;">
        <input id="next" type="button" value="RUN" class="btnFooter" 
              style="height: 75px; width: 350px;" />
      </div>
   </div>
   <input type="hidden" id="subItem" />
</asp:Content>

<asp:Content ID="Content5" ContentPlaceHolderID="ScriptsSection" runat="server">

<style type="text/css">
.hide
{
    display:none;
}    

input[type=text]
{
    font-size: 1em;
    height: 2em;
    line-height: 2.5em;
    width: 30%;
}
</style>
 <script src='<%: Url.Content("~/Scripts/autoNumeric.js") %>' type="text/javascript"></script>
    <script src='<%: Url.Content("~/Scripts/jquery.metadata.js") %>' type="text/javascript"></script>
<% if (false)
   { %>
<script src="../../Scripts/jquery-1.7.1.js" type="text/javascript"></script>
<% } %>
<script type="text/javascript" >
    $(function () {
        var $newPosY = 348;
        var $newPosX = 1024;
        $("#numericInput").draggable({
            drop: function (event, ui) {

                // position of the draggable minus position of the droppable
                // relative to the document
                $newPosX = ui.offset.left - $(this).offset().left;
                $newPosY = ui.offset.top - $(this).offset().top;

            }
        });
        var clickNum = null;
        $('.key').click(function (event) {

            var numBox = clickNum;
            if (clickNum.is(':disabled')) {
                return;
            }

            //            o = numBox.data('mask');
            //            o.maskArray = "999.99"
            var marks = (numBox).attr("mask");
            var max = (numBox).attr("maxlength").length;
            var maskArray = marks.split('');
            if (numBox.val().length == max) {
                return;
            }

            var v = $.trim(this.innerHTML);
            var valueArray = ($.trim(numBox.val())).split('')
            var idx = $.inArray(".", valueArray);

            if ((v == ".") && (idx > -1)) {
                return;
            }

            if ($.trim(this.innerHTML) == ".") {
                if ($.inArray(".", maskArray) < 0) {
                    return;
                }
                numBox.val(numBox.val() + '.');
                return;
            }

            var i = valueArray.length;


            if (idx >= 0) {
                var pt = maskArray.length - ($.inArray(".", maskArray));
                var x = valueArray.length + 1 - idx;
                if (x > pt) {
                    return;
                }
                i = $.inArray(".", maskArray) + 1;


            } else if ((i > 0) && (maskArray[i] == '.')) {
                numBox.val(numBox.val() + '.');
            }

            if (maskArray[i] == 'undefine') {
                return;
            }

            if (v <= maskArray[i]) {
                numBox.val(numBox.val() + v);
            }

            event.stopPropagation();
        });

        $('.btn,#close').click(function (event) {
            var numBox = clickNum
            if ($.trim(this.innerHTML) == 'DEL') {
                if (numBox.val().length > 0) {
                    clickNum.val(numBox.val().substring(0, numBox.val().length - 1));
                }
                else {
                    numBox.val('');
                }
            }
            else {
                $("#keypad").slideToggle();
                clickNum = null;
            }

            event.stopPropagation();
        });

        //End keypad

        function callScriptMethod(url, jsonObject, action, callback, async) {

            callback = callback || function () { };
            async = (async == null || async);

            $.ajax({
                type: "POST",
                contentType: "application/json; charset=utf-8",
                url: url,
                data: JSON.stringify(jsonObject),
                dataType: "json",
                async: async,
                success: function (data) {

                    if (data.success != "0") {
                        var getUsersUrl = '<%= Url.Action("New_Sample_PROC","NewSample") %>' + '?seq=' + '<%= Model._Plandt %>' + "-" + '<%=Model._Itemno %>';

                        window.location = getUsersUrl;
                    } else alert(data.message);
                },
                error: function (xhr, status, error) {
                    var err = xhr.responseText;
                    alert(err.Message);
                }
            });
        }

        $("#back").click(function () {
            var url = '<%= Url.Action("RollBack_Data","BiasHead_KANBAN") %>' + '?seq=' + '<%= Model._Plandt %>' + "-" + '<%=Model._Itemno %>' + "&biasno=" + '<%: Model._Biasno %>' + "&shift=" + '<%: Model._Shift %>' + "&subItem=" + $("#subItem").val();
            url = url + '&shift=' + '<%: TireBias.Models.SessionBag.Current.shift  %>' + '&sample=1';
            window.location = url;
        });

        $("#next").click(function () {
            var bln = false;
            var i = 0;
            var txt1 = "";
            var txt2 = "";
            var len1 = 0;
            var len2 = 0;
            var len3 = 0;
            var len4 = 0;
            var txtw1 = 0;
            var txtw2 = 0;
            $(".req").each(function () {
                i = i + 1;
                if (bln) return;
                if ($(this).val() == "") {
                    bln = true;
                    alert("ระบุค่าไม่ครบ");
                    $(this).focus();
                }

            });

            if (bln) return;

            txt1 = $(".ang:first").find("input:text:eq(0)").val();
            if ($(".ang").length > 1) {
                txt2 = $(".ang:last").find("input:text").val();
            }
            txtw1 = $(".width:first").find("input:text:eq(0)").val();
            
            if ($(".width").length > 1) {
                txtw2 = $(".width:last").find("input:text").val();
            }

            $(".ply").each(function () {
                var t = $(this).find("input:text");
                if (t.hasClass("P1")) {
                    len1 = parseInt(len1) + parseInt(t.val());
                }
                if (t.hasClass("P2")) {
                    len2 = parseInt(len1) + parseInt(t.val());
                }
                if (t.hasClass("P3")) {
                    len3 = parseInt(len1) + parseInt(t.val());
                }
                if (t.hasClass("P4")) {
                    len4 = parseInt(len1) + parseInt(t.val());
                }
            });


            var dataForSubmit = new Array();
            dataForSubmit.push({
                _biasno: '<%:  TireBias.Models.SessionBag.Current.biasno %>',
                _plandt: '<%: Model._Plandt %>',
                _itemno: '<%: Model._Itemno %>',
                _sitemno: $("#subItem").val(),
                _empname: '<%: User.Identity.Name %>',
                _shift: '<%:  TireBias.Models.SessionBag.Current.shift  %>',
                _Ply1: txt1,
                _Ply2: txt2,
                _tPly1: len1,
                _tPly2: len2,
                _tPly3: len3,
                _tPly4: len4,
                _widthPly1: txtw1,
                _widthPly2: txtw2
            });
            var getUsersUrl = '<%= Url.Action("Run_TireSAMPLE","NewSample") %>';
            callScriptMethod(getUsersUrl, { theData: dataForSubmit }, 'ADD');
        });



        $('.req').live("click", function (event) {
            var o = {
                left: $newPosX,
                top: $newPosY
            };

            if ((clickNum == null) || ($(this).attr("id") == clickNum.attr("id"))) $("#keypad").slideToggle().offset(o);
            clickNum = $(this);
            event.stopPropagation();
        });

        $.post('<%=Url.Action("Get_Value","BiasHead_KANBAN") %>' + '?seq=' + '<%= Model._Plandt %>' + "-" + '<%=Model._Itemno %>' + '&biasno=' + '<%= Model._Biasno %>' + '&shift=' + '<%= Model._Shift %>'
      , function (data) {
          if (data.success == 1) {
              $("#subItem").val(data.subItem);
              $("#ply1").text(data.ply1);
              $("#ply2").text(data.ply2);

              if (data.ply2 != "") {
//                  var tr = $("#ang").clone(true).removeClass("hide").addClass("ang");

//                  var txt = tr.find("input:text:eq(0)");
//                  txt.addClass("req").attr("id", "ap1");

//                  txt.attr("maxlength", 6).attr("mask", "999.99").autoNumeric({ vMin: '0', vMax: '999.99', aPad: false })
//                  tr.find("span:first").text(data.ply2 + ' ');
//                  tr.find("span:last").text(' ' + data.ply2.replace("P", ""));
//                  $("#ang").after(tr);

                  var tr1 = $("#ply").clone(true).removeClass("hide").addClass("ply");
                  var txt1 = tr1.find("input:text:eq(0)");
                  txt1.addClass("req").attr("id", "p1").addClass(data.ply2); ;
                  txt1.attr("maxlength", 3).attr("mask", "999").autoNumeric({ vMin: '0', vMax: '999', aPad: false })
                  tr1.find("span:first").text(data.ply2 + ' ');
                  $("#ply").after(tr1);

                  var tr2 = $("#width").clone(true).removeClass("hide").addClass("width");
                  var txt2 = tr2.find("input:text:eq(0)");
                  txt2.addClass("req").attr("id", "w1").addClass(data.ply2); ;
                  txt2.attr("maxlength", 3).attr("mask", "999").autoNumeric({ vMin: '0', vMax: '999', aPad: false })
                  tr2.find("span:first").text(data.ply2 + ' ');
                  $("#width").after(tr2);

              }
              if (data.ply1 != "") {
                  var tr = $("#ang").clone(true).removeClass("hide").addClass("ang");
                  var txt = tr.find("input:text:eq(0)");
                  txt.addClass("req").attr("id", "ap2");
                  txt.attr("maxlength", 6).attr("mask", "999.99").autoNumeric({ vMin: '0', vMax: '999.99', aPad: false })
//                  tr.find("span:first").text(data.ply1 + ' ');
//                  tr.find("span:last").text(' ' + data.ply1.replace("P", ""));
                  $("#ang").after(tr);


                  var tr1 = $("#ply").clone(true).removeClass("hide").addClass("ply");
                  var txt1 = tr1.find("input:text:eq(0)");
                  txt1.addClass("req").attr("id", "p2").addClass(data.ply1);
                  txt1.attr("maxlength", 3).attr("mask", "999").autoNumeric({ vMin: '0', vMax: '999', aPad: false })
                  tr1.find("span:first").text(data.ply1 + ' ');
                  $("#ply").after(tr1);

                  var tr2 = $("#width").clone(true).removeClass("hide").addClass("width");
                  var txt2 = tr2.find("input:text:eq(0)");
                  txt2.addClass("req").attr("id", "w2").addClass(data.ply1);
                  txt2.attr("maxlength", 3).attr("mask", "999").autoNumeric({ vMin: '0', vMax: '999', aPad: false })
                  tr2.find("span:first").text(data.ply1 + ' ');
                  $("#width").after(tr2);
              }
          }
          else alert(data.message);
      });

    });

</script>
</asp:Content>
